<template>
 <div class="main-background">
    <!-- 头部 -->
    <div class="setfot">
      <span>
        <div class="setdiv">
          <a v-show="showxtgl" href="javascript:void(0);" @click="tosys">系统管理</a>
          <a href="#" @click="modify">密码设置</a>
          <a href="javascript:void(0);" @click="logout">退出系统</a>
        </div>
      </span>
    </div>
    <!-- <div> <el-button type="primary">主要按钮</el-button></div> -->
    <el-tooltip placement="bottom" effect="light"><div slot="content">版本号：V2020_1.0.0.0</div><div class="banben"><i class="el-icon-warning-outline"></i></div></el-tooltip>
    <el-tooltip content="帮助手册" placement="bottom" effect="light" ><div class="bangzhu"><i class="el-icon-collection"></i></div></el-tooltip>
    <div class="main-header">
      <div class="left-logo"><span></span>水利统计管理信息系统</div>
      <div class="right-btn">
        <form class="searchform">
          <input id="searchbox" type="text" class="searchbox" placeholder="请输入查询内容">
          <span class="searchbutton"><i class="fa fa-search"><img src="~@/assets/portal/images/new_index/sousuo.png" width="18" height="18"></i></span>
        </form>
        <ul class="nav ">
          <li class="nav-item">
            <div class="news">3</div>
            <a href="#"><img src="~@/assets/portal/images/new_index/xi.png"></a>
          </li>
        <!-- <li class="nav-ite">
          <a href="#">
            <img src="~@/assets/portal/images/new_index/touxiang.png" alt="" width="35" style=" margin-top:.3rem"/>
            <span class="admin-name">Andmin</span>
          </a>
        </li> -->
        </ul>
      </div>
    </div>
    <!-- 内容 -->
    <div class="main-contentBox">
      <div class="conter_top">
        <div class="left_box">
          <div class="top_nav_box box_bj">
            <div class="card-title">基础管理</div>
            <di<div class="card-content top">
              <ul class="content-listBox">
                <li id="hrefYFJD" class="content-listItem" @click="tojiankong"> 
                  <img src="~@/assets/portal/images/new_index/RC.png">
                  <span>机构信息管理</span>
                </li>
                <li class="content-listItem" @click="stats">
                   <img src="~@/assets/portal/images/new_index/JD.png">
                  <span>水利统计系统</span>
                </li>
                <!-- <li class="content-listItem"  @click="$XModal.message({ message: '升级改造中，敬请期待。。。', id: 'unique1',  status:'success', iconStatus: 'el-icon-coffee-cup' })"> -->
                <li class="content-listItem"  @click="toxxgl">
                  <!-- @click="ztbb"-->
                  <!-- <div class="red-circle" /> -->
                  <img src="~@/assets/portal/images/new_index/PX.png">
                  <span>测试布局组件模块</span>
                </li>
                <li class="content-listItem" @click="value1 = true"><img src="~@/assets/portal/images/new_index/KH.png"><span>Excel信息采集</span>
                </li>
                <li class="content-listItem"  @click="value2 = true">
                  <!-- <div class="red-circle" /> -->
                  <img src="~@/assets/portal/images/new_index/SP.png">
                  <span>数据接收</span>
                </li>
                <li class="content-listItem" @click="stats">
                  <!-- <div class="red-circle" /> -->
                  <img src="~@/assets/portal/images/new_index/WW.png">
                  <span>职级管理</span>
                </li>
              </ul>
            </div>
          </div>
          <div class="center_nav_box box_bj">
            <div class="card-title">统计年报</div>
            <div class="card-content cnter">
              <div class="switch_item">
                <ul>
                  <li class="five"  @click="statinfo"><p><em>统计专用库管理</em><u></u></p></li>
                  <li class="six"  @click="stats" ><p><em>水利统计系统</em><u></u></p></li>
                  <li class="five seven" @click="$XModal.message({ message: '升级改造中，敬请期待。。。', id: 'unique1',  status:'success', iconStatus: 'el-icon-coffee-cup' })"><p><em>年鉴资料</em><u></u></p></li>
                  <!-- @click="stats"  -->
                </ul>
              </div>
            </div>
          </div>
          <div class="fot_nav_box box_bj">
            <div class="card-title">查询应用</div>
            <div class="card-content">
              <div class="switch_item">
                <ul>
                  <li class="three" @click="$XModal.message({ message: '升级改造中，敬请期待。。。', id: 'unique1',  status:'success', iconStatus: 'el-icon-coffee-cup' })"><span>综合查询分析系统</span></li>
                  <!-- @click="leader" $XModal.message({ message: '升级改造中，敬请期待。。。', id: 'unique1',  status:'success', iconStatus: 'el-icon-coffee-cup' })-->
                  <li class="four" @click="valueapp = true"><span>PAD端APP</span></li>
                  <!-- @click="$XModal.message({ message: '升级改造中，敬请期待。。。', id: 'unique1',  status:'success', iconStatus: 'el-icon-coffee-cup' })" -->
                </ul>
              </div>
            </div>
          </div>
        </div>
        <div class="center_box">
			<div class="topmk box_bj">
        <div class="card-title">队伍情况</div>
        <div class="top_zong top" style="padding-bottom: 0px;">   
				<div class="bottom-contentItem" style="padding-top: .8rem;">
              <div class="itemNumber">
                {{statisticNumber.sumCount}}<span> 人</span>
              </div>
              <div class="itemText">
                公务员总数
              </div>
            </div>
            <div class="bottom-contentItem" style="padding-top: .8rem;">
              <div class="itemNumber">
                {{ statisticNumber.sumLDZW }}<span> 人</span>
              </div>
              <div class="itemText">
                领导职务
              </div>
            </div>
            <div class="bottom-contentItem" style="padding-top: .8rem;">
              <div class="itemNumber">
                {{statisticNumber.sumZHGLL}}<span> 人</span>
              </div>
              <div class="itemText">
                综合管理类职级
              </div>
            </div>
            <div class="bottom-contentItem" style="padding-top: .8rem;">
              <div class="itemNumber">
                {{statisticNumber.sumJRZJ}}<span> 人</span>
              </div>
              <div class="itemText">
                兼任职级
              </div>
            </div>
          </div>
          <div class="top_zong cent">
            <div class="topline_h"></div>
               <div class="biaoth">职级情况 </div>
				   <div class="bottom-contentItem">
              <div class="itemNumber">
                {{statisticNumber.XSY}}<span> 人</span>
              </div>
              <div class="itemText">
                巡视员(1-2级)
              </div>
            </div>
            <div class="bottom-contentItem">
              <div class="itemNumber">
                {{ statisticNumber.DYY }}<span> 人</span>
              </div>
              <div class="itemText">
                调研员(1-4级)
              </div>
            </div>
            <div class="bottom-contentItem">
              <div class="itemNumber">
                {{statisticNumber.ZRKY}}<span> 人</span>
              </div>
              <div class="itemText">
                主任科员(1-4级)
              </div>
            </div>
            <div class="bottom-contentItem">
              <div class="itemNumber">
                {{statisticNumber.KY}}<span> 人</span>
              </div>
              <div class="itemText">
                科员(1-2级)
              </div>
            </div>
            </div>
             <div class="top_zong fot">
               <div class="topline_h"></div>
               <div class="biaoth">年龄情况</div>
				<div class="bottom-contentItem">
              <div class="itemNumber">
                {{statisticNumber.limit35}}<span> 人</span>
              </div>
              <div class="itemText">
                35岁及以下
              </div>
            </div>
            <div class="bottom-contentItem">
              <div class="itemNumber">
                {{ statisticNumber.limit36To45 }}<span> 人</span>
              </div>
              <div class="itemText">
                36岁至45岁
              </div>
            </div>
            <div class="bottom-contentItem">
              <div class="itemNumber">
                {{statisticNumber.limit46To55}}<span> 人</span>
              </div>
              <div class="itemText">
                46岁至55岁
              </div>
            </div>
            <div class="bottom-contentItem">
              <div class="itemNumber">
                {{statisticNumber.limit56}}<span> 人</span>
              </div>
              <div class="itemText">
                56岁及以上
              </div>
            </div>
			</div>
			</div>
          <!-- 底部信息 -->
          <div class="fotmk box_bj">
			  <div class="biao">政策法规</div>
        <!-- <div class="more" @click='toZcfglNews' >详情信息</div> -->
	<div class="beib">
				  <zcfg></zcfg>
			</div>
          </div>
        </div>
        <div class="right_box box_bj">
          <div class="card-title">业务模块</div>
          <div class="card-content" style="padding: 0;">
            <ul class="wordMenu-listBox">
              <li class="wordMenu-listItem">

                  <div class="menu-box" @click="$XModal.message({ message: '需授权访问', id: 'unique1', status:'info', iconStatus: 'el-icon-lock' })">
                    <img src="~@/assets/portal/images/new_index/RY.png">
                    <span>录用管理</span>
                  </div>

              </li>
              <li class="wordMenu-listItem" @click="$XModal.message({ message: '需授权访问', id: 'unique1', status:'info', iconStatus: 'el-icon-lock' })">

                  <div class="menu-box">
                    <img src="~@/assets/portal/images/new_index/fbh.png">
                    <span>登记备案</span>
                  </div>

              </li>
             <li class="wordMenu-listItem" @click="$XModal.message({ message: '需授权访问', id: 'unique1', status:'info', iconStatus: 'el-icon-lock' })">

                  <div class="menu-box ">
                    <img src="~@/assets/portal/images/new_index/PXGL.png">
                    <span>干部任免</span>
                  </div>

              </li>
              <li class="wordMenu-listItem" @click="$XModal.message({ message: '需授权访问', id: 'unique1', status:'info', iconStatus: 'el-icon-lock' })">

                  <div class="menu-box">
                    <img src="~@/assets/portal/images/new_index/ui.png">
                    <span>教育培训</span>
                  </div>

              </li>
               <li class="wordMenu-listItem">

                  <div class="menu-box hasnew ys" @click="$XModal.message({ message: '需授权访问', id: 'unique1', status:'info', iconStatus: 'el-icon-lock' })">
                    <img src="~@/assets/portal/images/new_index/TTX.png">
                    <span>平时考核</span>
                  </div>

              </li>
               <li class="wordMenu-listItem" @click="$XModal.message({ message: '需授权访问', id: 'unique1', status:'info', iconStatus: 'el-icon-lock' })">

                  <div class="menu-box">
                    <img src="~@/assets/portal/images/new_index/RYBQ.png">
                    <span>奖励管理</span>
                  </div>

              </li>
              <li class="wordMenu-listItem" @click="$XModal.message({ message: '需授权访问', id: 'unique1', status:'info', iconStatus: 'el-icon-lock' })">

                  <div class="menu-box">
                    <img src="~@/assets/portal/images/new_index/JCZ.png">
                    <span>出国(境)管理</span>
                  </div>

              </li>
              <li class="wordMenu-listItem" @click="$XModal.message({ message: '需授权访问', id: 'unique1', status:'info', iconStatus: 'el-icon-lock' })">

                  <div class="menu-box hasnew sy">
                    <img src="~@/assets/portal/images/new_index/RCK.png">
                    <span>工资管理</span>
                  </div>

              </li>
                <li class="wordMenu-listItem" @click="$XModal.message({ message: '需授权访问', id: 'unique1', status:'info', iconStatus: 'el-icon-lock' })">

                  <div class="menu-box">
                    <img src="~@/assets/portal/images/new_index/lcv.png">
                    <span>档案管理</span>
                  </div>

              </li>
             
              <li class="wordMenu-listItem" @click="$XModal.message({ message: '需授权访问', id: 'unique1', status:'info', iconStatus: 'el-icon-lock' })">

                  <div class="menu-box">
                    <img src="~@/assets/portal/images/new_index/JDRYGL.png"><span>人才库管理</span>
                  </div>

              </li>
               <li class="wordMenu-listItem" style="border-right:1px solid #e5e5e5;" @click="$XModal.message({ message: '需授权访问', id: 'unique1', status:'info', iconStatus: 'el-icon-lock' })">

                  <div class="menu-box">
                    <img src="~@/assets/portal/images/new_index/KHGL.png">
                    <span>借调人员</span>
                  </div>

              </li>

              <li class="wordMenu-listItem" @click="$XModal.message({ message: '需授权访问', id: 'unique1', status:'info', iconStatus: 'el-icon-lock' })">

                  <div class="menu-box">
                    <img src="~@/assets/portal/images/new_index/yit.png">
                    <span>更多模块</span>
                  </div>

              </li>

            </ul>
          </div>
        </div>
      </div>
      <div class="conter_fot box_bj">
        <div class="fot_btn">
          <div class="div_fen"  @click="toPage('/admin/user/main?page%2Eaim=USER&page%2Emenu=01')" >
            <p><span><i class="fa fa-user-circle-o"></i>  用户管理</span></p>
          </div>
          <div class="div_fen" @click="toPage('/admin/user/main?page%2Eaim=USER&page%2Emenu=01')">
            <p><span><i class="fa fa-key"></i>  权限管理</span></p>
          </div>
          <div class="div_fen" @click="toPage('/admin/sys/main?page%2Eaim=SYS&page%2Emenu=02')">
            <p ><span><i class="fa fa-cogs"></i>  系统管理</span></p>
          </div>
          <div class="div_fen" @click="toPage('/admin/dev/main?page%2Eaim=DEV&page%2Emenu=19')">
            <p ><span><i class="fa fa-desktop"></i>  支撑平台</span></p>
          </div>
        </div>
      </div>
      <!-- <el-dialog
      :title="xiugaimim"
      :visible.sync="changepassformshow"
      class="yhgl"
    > -->
     <vxe-modal v-model="changepassformshow" title="修改密码" width="500" height="300" >
       <el-container>
      <el-main>
        <vxe-form ref="ruleForm" :data="ruleForm" :rules="rules" title-align="right" title-width="80" style="width:80%; margin:16px auto;">
          <vxe-form-item title="原密码" field="pass" span="24">
                <vxe-input v-model="ruleForm.pass" placeholder="请输入原密码" type="password" clearable></vxe-input>
            </vxe-form-item>
             <vxe-form-item title="新密码" field="password" span="24">
                <vxe-input v-model="ruleForm.password" placeholder="请输入新密码" type="password" clearable></vxe-input>
            </vxe-form-item>
             <vxe-form-item title="确认密码" field="cheakpass" span="24">
                <vxe-input v-model="ruleForm.cheakpass" placeholder="请输入确认密码" type="password" clearable></vxe-input>
            </vxe-form-item>
        </vxe-form>
      </el-main>
      <el-footer class="vxe_modal_btn" style="padding:6px; text-align:center">
         <vxe-button
            type="primary"
            @click="savechangepass('ruleForm')"
          >保存</vxe-button>
          <vxe-button
            @click="closechangepasspanel('ruleForm')"
          >取消</vxe-button>
      </el-footer>
    </el-container>
<!--
      <el-form
        ref="ruleForm"
        :rules="rules"
        :model="ruleForm"
        label-width="120px"
        class="yhgl_form"
      >
        <el-form-item label="原密码" prop="pass">
          <el-input v-model="ruleForm.pass" type="password" />
        </el-form-item>
        <el-form-item label="新密码" prop="password">
          <el-input v-model="ruleForm.password" type="password" />
        </el-form-item>
        <el-form-item label="确认密码" prop="cheakpass">
          <el-input v-model="ruleForm.cheakpass" type="password" />
        </el-form-item>
        <div class="btn">
          <el-button
            type="primary"
            @click="savechangepass('ruleForm')"
          >保存</el-button>
          <el-button
            type="primary"
            @click="closechangepasspanel('ruleForm')"
          >取消</el-button>
        </div>
      </el-form> -->
     </vxe-modal>
    <!-- </el-dialog> -->
          <!-- <vxe-modal v-model="zreeshow" width="1000px" height="500px" title="PAD端app" class="no_maximize">
           <tree></tree>
          </vxe-modal> -->
 </div>

    </div>
</template>

<script>
import request from "@/utils/requestutil";
import { getRealUrl } from "@/utils/httpRequet";
import router, { resetRouter } from "@/router";
import Cookies from "js-cookie";
import echarts from "echarts";
import china from "@/assets/portal/lib/echarts/china.js";
import zcfg from "./zcfg";
import $ from "jquery";
// import tree from "@/views/components-demo/select-tree.vue";

export default {
  components: {
    zcfg,
    // tree,
  },
  data() {
    return {
      showxtgl: this.$store.state.user.userInfo.userType == "ADMIN",
      value1: false,
      value2: false,
      valueapp: false,
      // zreeshow:true,
      baseFontSize: 18,
      changepassformshow: false,
      lformLabelWidth: "80",
      // xiugaimim: "修改密码",
      rules: {
        pass: [{ required: true, message: "请填写原密码", trigger: "blur" }],
        password: [
          {required: true, message: "新密码不能为空"},
          {pattern: /^(?![A-Za-z]+$)(?![A-Z\d]+$)(?![A-Z\W]+$)(?![a-z\d]+$)(?![a-z\W]+$)(?![\d\W]+$)\S{8,}$/,
            message: "密码必须是数字、大小写字母和特殊字符任选3个"}
        ],
        cheakpass: [{required: true, message: "确认密码不能为空"},{ validator: this.validatePass }],
      },

      ruleForm: {
        userid: "",
        name: "",
        password: "",
        cheakpass: "",
        pass: "",
      },
      // 公务员总数以及女少非数字
      statisticNumber: {
        sumAll: 0,
        sumNation: 0,
        sumWomen: 0,
        sumWrong: 0,
      },
    };
  },
  created() {
    this.indexData();
  },
  methods: {
    validatePass () {
      if (this.ruleForm.cheakpass == "") {
        return new Error("请再次输入密码")
      } else if (this.ruleForm.cheakpass != this.ruleForm.password) {
        return new Error("两次输入密码不一致！")
      }
    },
    toExcelSys() {
      const { href } = this.$router.resolve({
        path: "/excel",
      });
      window.open(href + "?root=nomenu", "excel_tb");
    },
    toShujuSys() {
      const { href } = this.$router.resolve({
        path: "/jieshou",
      });
      window.open(href + "?root=nomenu", "jieshou_tb");
    },
    toZcfglNews() {
      const { href } = this.$router.resolve({
        path: "/zcfg",
      });
      window.open(href + "?root=nomenu", "zcfg_tb");
    },
    toPersonList() {
      const { href } = this.$router.resolve({
        path: "/personlist",
      });
      window.open(href + "?root=nomenu", "personlist_tb");
    },
    barOption(data, name, xAisaLabel) {
      let baseFontSize = this.baseFontSize;
      var yData = [],
        barData = [];
      data.forEach(function (item) {
        yData.push(item.name);
        barData.push({
          value: item.value,
          scoper: item.scoper,
        });
      });
      yData.reverse();
      barData.reverse();
      return {
        tooltip: {
          extraCssText:
            "background:rgba(255,255,255,0.8); color:#000; border: 1px solid #6cc9ff;border-radius: 10px;",
          show: true, //鼠标移入是否触发数据
          trigger: "item", //出发方式
          formatter: "{a}:<br /> {b} {c}  ",
        },
        grid: {
          left: "-5%",
          right: "20%",
          top: "2%",
          bottom: "3%",
          containLabel: true,
        },
        xAxis: {
          type: "value",
          show: true,
          name: xAisaLabel.name,
          nameGap: 5,
          nameTextStyle: {
            fontSize: 11,
          },
          axisLabel: {
            show: true,
            margin: 10,

            fontSize: baseFontSize / 1.45,
            align: "center",
            color: "#000",
          },
          axisLine: {
            symbolSize: [8, 12],

            symbol: ["none", "arrow"],
          },
          splitLine: {
            show: true,
            lineStyle: {
              type: "dashed",
            }, //设置背景为虚线
          },
        },
        yAxis: {
          type: "category",
          data: yData,
          axisTick: {
            show: false,
          },
          // max:10,
          axisLabel: {
            show: true,
            margin: 20,
            fontSize: baseFontSize / 1.45,
            align: "center",
            color: "#000",
          },
          axisLine: {
            show: true,
            lineStyle: {},
          },
          splitLine: {
            show: false,
          },
        },
        series: [
          {
            name: name,
            type: "bar",
            barWidth: "60%",
            // barCategoryGap: "100%",
            label: {
              normal: {
                show: true,
                position: "insideRight",
                color: "#fff",
                fontSize: baseFontSize / 1.65,
                formatter: "{c}  ",
              },
            },
            itemStyle: {
              // barBorderRadius: [5, 5, 5, 5],
              color: "#248fff",

              shadowColor: "rgba(36, 143, 225, 0.9)",
              shadowBlur: 1,
            },
            data: barData,
          },
        ],
      };
    },
    mapDataOption(data, visueMapPeices, visueText, name, titleText) {
      data = data == undefined ? [] : data;
      let baseFontSize = this.baseFontSize;
      return {
        title: {
          text: titleText,
          left: "33%",
          top: "5%",
          textStyle: {
            fontSize: baseFontSize / 1,
          },
        },
        tooltip: {
          extraCssText:
            "background:rgba(255,255,255,0.8); color:#000; border: 1px solid #6cc9ff;border-radius: 10px;",
          show: true, //鼠标移入是否触发数据
          trigger: "item", //出发方式
          // textStyle:{color:#000,fontSize:12},
          // formatter: function(params) {
          // 	console.log(params)
          // 	return '<h1 class="mapToolip-title">公务员数量<span>详情</span></h1>' +
          // 	'<div class="mapToolip-content">'+
          // 	'<div class="content-item">'+params.data.name+'<span>'+params.data.value+' 个</span></div>'+

          // 	'</div>'
          // }
          formatter: "{a}:<br /> {b} {c}  ",
        },
        //地图图裂
        visualMap: {
          type: "piecewise",
          min: 100,
          left: "3%",
          bottom: "2%",
          itemGap: baseFontSize / 2,
          showLabel: !0,
          align: "left",
          //orient: 'horizontal', //图例水平放置
          itemWidth: baseFontSize / 0.96,
          inverse: true,
          itemHeight: baseFontSize / 1.536,

          textStyle: {
            color: "#000",

            fontSize: baseFontSize / 1.57,
          },
          orient: "vertical",
          text: visueText,
          pieces: visueMapPeices,
          show: !0,
        },
        geo: {
          map: "china",
          left: "15%",
          right: "10%",
          top: "10%",
          bottom: "8%",
          zoom: 1.1,
          // aspectScale: 0.9, //长宽比
          label: {
            show: true,
            fontSize: baseFontSize / 1.5,
            color: "#333",
          },
          roam: false,
          itemStyle: {
            normal: {
              borderColor: "#72d4f6",
              borderWidth: 3,
              shadowColor: "#b4d9ec",
              shadowBlur: 10,
              areaColor: "#272235",
              fontWeightL: 700,
              /*  shadowBlur:20,
					  shadowColor: '#fff',*/
            },
          },
        },
        series: [
          {
            name: name,
            show: true,
            type: "map",
            mapType: "china",
            // getIndx: 0,
            data: data,
            left: "15%",
            right: "10%",
            top: "10%",
            bottom: "8%",
            // aspectScale: 0.9,
            selectedMode: "single", //当点击相应的地图的区域，是否多选或单选
            roam: false,
            zoom: 1.1,
            label: {
              show: true,
              fontSize: baseFontSize / 1.5,
              color: "#333",
            },
            itemStyle: {
              normal: {
                borderColor: "#8fb1d0",
                borderWidth: 1,
              },
            },

            animation: true,
          },
        ],
      };
    },
    tojiankong() {
      //window.open(this.$router.resolve('/jk/yxjk').href, '_blank')
      this.subsysinfo.curid = "jggl";
      this.to();
    },
    tosys: function () {
      // this.subsysinfo.curid = 'sysmanger'
      let url = getRealUrl("/admin/frame/main", true);
      url = url.replace("_VIEWER=APP", "");
      window.open(url, "hy_portal");
      // this.to()
    },
    toPage(url) {
      if (this.showxtgl) {
        url = getRealUrl(url, true);
        url = url.replace(/%2E/g, ".");
        url = url.replace("_VIEWER=APP", "");
        window.open(url, "hy_portal");
      }else{
        this.$XModal.message({ message: '需授权访问', id: 'unique1', status:'info', iconStatus: 'el-icon-lock' })
      }
    },
    stats: function () {
      this.subsysinfo.curid = "stats";
      this.to();
    },
    toxxgl: function () {
      this.subsysinfo.curid = "jcxx";
      this.to();
    },
    statinfo: function () {
      this.subsysinfo.curid = "statinfo";
      this.to();
    },
    ztbb: function () {
      this.subsysinfo.curid = "ztbb";
      this.to();
    },
    //新加111
    leader: function () {
      this.subsysinfo.curid = "leader";
      this.to();
    },
    totaskgl() {
      this.subsysinfo.curid = "task";
      this.to();
    },
    to: async function () {
      //Cookies.set('subsysid', this.subsysinfo.curid)
      const { menuids, roles, userid } = await this.$store.dispatch(
        "user/getInfo"
      );
      const accessRoutes = await this.$store.dispatch(
        "permission/generateRoutes",
        { roles: roles, menuids: menuids }
      );
      // dynamically add accessible routes
      resetRouter();
      // 新页面打开
      router.addRoutes(accessRoutes);
      const { href } = this.$router.resolve({
        path: "/mainLayout",
      });
      window.open(
        href + "?root=" + this.subsysinfo.curid,
        this.subsysinfo.curid
      );
      // 本页面打开
      // this.$router.push("/dashboard");
    },
    // 退出
    async logout() {
      await this.$store.dispatch("user/logout");
      this.$router.push(`/login?redirect=${this.$route.fullPath}`);
    },
    // 修改密码弹框
    modify: function () {
      this.xiugaimim =
        "修改密码————" + this.$store.state.user.userInfo.realName;

      this.changepassformshow = true;
    },

    // 保存
    async savechangepass() {
      const errMap = await this.$refs.ruleForm.validate().catch(error => {
        console.log(error)
        return Promise.reject("没有完成表单校验")
      })
      const $t = this;
      request({
        url: "userpasswprd",
        method: "get",
        params: {
          oldPassword: $t.ruleForm.pass,
          newPassword: $t.ruleForm.password,
        },
      }).then(function (data) {
        if (data.result == "SUCCESS") {
          $t.$message.success("修改成功");
        } else {
          $t.$message.error("修改失败");
        }
      });
    },
    // 关闭弹窗
    closechangepasspanel: function () {
      this.changepassformshow = false;
    },
    init() {
      //行政区域选择
      $(document).on("click", "#tit .xs", function () {
        let i = $(this).index();
        $(this)
          .addClass("selected-item")
          .siblings()
          .removeClass("selected-item");
        $("#con .nr").eq(i).show().siblings().hide();
      });
    },
    // 获取总数,女少非等数量
    indexData() {
      request({
        url: "indexData",
        method: "get",
        params: {},
      })
        .then((res) => {
          if (res.success) {
            this.statisticNumber = res.obj;
          } else {
            console.log(res.msg);
          }
        })
        .catch((error) => {
          console.log(error.toString());
        });
    },
  },
  mounted() {
    this.init();
  },
  computed: {
    // statisticNumberVo() {
    //   let data = {}
    //   for (let key in this.statisticNumber) {
    //     let number = this.statisticNumber[key]
    //     if (number > 10000) {
    //       data[key] = number / 10000
    //       data[key] = data[key] + '万'
    //     } else if (number > 1000) {
    //       data[key] = number / 1000
    //       data[key] = data[key] + '千'
    //     } else if (number > 100) {
    //       data[key] = number / 100
    //       data[key] = data[key] + '百'
    //     }
    //   }
    //   return data
    // }
  },
};
</script>

<style lang="scss" scoped>
@import "~@/assets/portal/css/index/rem.css";
@import "~@/assets/portal/css/index/index.css";
@import "~@/assets/portal/css/index/peij.css";
body {
  font-family: "Microsoft YaHei";
  background-color: #060131;
}
::v-deep body {
  background-color: aqua;
}
::v-deep #app {
  background-color: black;
}
ul {
  margin-top: 0px;
}

.right-btn {
  display: none;
}
::-webkit-scrollbar {
  background: none;
  width: 4px;
  height: 4px;
  border-radius: 3px;
  right: 3px;
}

::-webkit-scrollbar-track,
::-webkit-scrollbar-thumb {
  border-radius: 3px;
  border: 0px solid transparent;
}

::-webkit-scrollbar-track {
  box-shadow: 0 0 0 4px rgba(24, 154, 80, 0) inset;
}

::-webkit-scrollbar-thumb {
  min-height: 20px;
  background-clip: content-box;
  box-shadow: 0 0 0 4px rgba(168, 178, 204, 0.4) inset;
}

::-webkit-scrollbar-corner {
  background: transparent;
}
.con {
  & .el-container {
    height: 1.6rem !important;
    padding-bottom: 0.2rem;
    .el-main {
      padding: 0px;
      font-size: 0.9rem;
      line-height: 1rem;
      color: #082638;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .el-aside {
      padding: 0px;
      line-height: 1rem;
      text-align: center;
      background-color: #fff;
      font-size: 0.8rem;
      color: #999;
    }
    .el-aside.xiazai:hover {
      cursor: pointer;
      color: #1a4df7;
    }
  }
}
</style>
